// JavaScript Document

window.onload=function(){
	// 搜索--------------------------------------------------------------
	var search_text=document.getElementById("search_text");
	search_text.onclick=function(){
        search_text.value="";
    }
    document.addEventListener("click",function(){
            search_text.value = "卡通手机壳";
    },true);
	//-------------------------------------------------------------
	
	
//放大镜---------------------------------------------------------------------------------------
	var bannerBox=document.getElementById('banner_box');
	var mirrorBox=document.getElementById("mir");
	var oSpan=bannerBox.getElementsByTagName('span')[0];
	var bigImg=mirrorBox.getElementsByTagName("img")[0];
	var bannerImg=document.getElementById('bannerImg');
	
	bannerBox.onmousemove=function(ev){
		ev=ev || window.event;
		var scrollTop=document.documentElement.scrollTop || document.body.scrollTop;//滚动条高度
		var scrollLeft=document.documentElement.scrollLeft || document.body.scrollLeft;//滚动条高度
		mirrorBox.style.display=oSpan.style.display="block";//当鼠标移到bannerBox时让放大镜显示
		//找到到ospan坐标
		var l=ev.clientX+scrollLeft-hxsd_tools.offsetLeft(bannerBox)-oSpan.offsetWidth/2;
		var t=ev.clientY+scrollTop-hxsd_tools.offsetTop(bannerBox)-oSpan.offsetHeight/2;
		//限制ospan的移动范围
		if(l<0){l=0};
		if(t<0){t=0};
		if(l>bannerBox.offsetWidth-oSpan.offsetWidth){l=bannerBox.offsetWidth-oSpan.offsetWidth};
		if(t>bannerBox.offsetHeight-oSpan.offsetHeight){t=bannerBox.offsetHeight-oSpan.offsetHeight};
		//计算移动的比率
		var rate_l=l/(bannerBox.offsetWidth-oSpan.offsetWidth);
		var rate_t=t/(bannerBox.offsetHeight-oSpan.offsetHeight);
		//移动oSpan
		oSpan.style.left=l+'px';
		oSpan.style.top=t+'px';
		//移动img
		bigImg.style.left=-rate_l*(bigImg.offsetWidth-mirrorBox.offsetWidth)+'px';
		bigImg.style.top=-rate_t*(bigImg.offsetHeight-mirrorBox.offsetHeight)+'px';
	};
	bannerBox.onmouseout=function(){
		mirrorBox.style.display=oSpan.style.display="none";//当鼠标移开bannerBox时让放大镜隐藏
	};
	
	//鼠标划过图片列表时，选择鼠标指定的li，并根据更新banner和mirror中的图
	var bannerImg_arr=["b57d0c55bNa8230260","b57d0c55cNa20597da","b57d0c55cNeb17a9b8","b57d0c55cN7cc6a427","b57d0c55cN02377681"];
	var bigImg_arr=["m57d0c55bNa8230260","m57d0c55cNa20597da","m57d0c55cNeb17a9b8","m57d0c55cN7cc6a427","m57d0c55cN02377681"];
	//找到到图片列表中的每一个li
	var picItems=document.getElementById('picItems');
	var aLi=picItems.getElementsByTagName('li');
	for( var i=0; i<aLi.length; i++){
		aLi[i].index=i;//发牌照
		//鼠标划过每一个li时切换ac
		aLi[i].onmousemove=function(){
			//清空所有li的ac  banner和mirror中的图片 
			for( var j=0; j<aLi.length; j++){
				aLi[j].className="";
				bannerImg.src="images/"+""+".jpg"
				bigImg.src="images/"+""+".jpg"
			};
			this.className="ac";
				bannerImg.src="images/"+bannerImg_arr[this.index]+".jpg"
				bigImg.src="images/"+bigImg_arr[this.index]+".jpg"
		};
	};
	
//choose部分的-----------------------------------------------------------
	var chooseShop=document.getElementById("chooseShop");
	var aDl=chooseShop.getElementsByTagName('dl');
	//找到每一个dl中的dd
	for( var m=0; m<aDl.length; m++){
		//鼠标划过对应的dl中的dd
		aDl[m].onmouseover=function(){
			var oDd=this.getElementsByTagName('dd')[0];
			var aA=oDd.getElementsByTagName('a');
			//鼠标划过每一个dd加上ac
			for( var n=0; n<aA.length; n++){
				aA[n].onclick=function(){
					for( var q=0; q<aA.length; q++){
						aA[q].className="";
					};
					this.className="ac";
				};
			};
		};
	};


//购物车数量-----------------------------------
	//找到按钮
	var addBtn=document.getElementById('addBtn');
	var redBtn=document.getElementById('redBtn');
	var numberBtn=document.getElementById('numberBtn');
	//点击addbtn增加value值
	addBtn.onclick=function(){
		numberBtn.value++;
	};
	redBtn.onclick=function(){
		numberBtn.value--;
		if(numberBtn.value<=1){
			numberBtn.value=1;
		};
	};



//----------产品推荐  选项卡-----------
	var navList=document.getElementById("navList");
	var aLiNav=navList.getElementsByTagName('li');
	var midWarp=document.getElementById("midWarp");
	var aMidInner=midWarp.getElementsByClassName("mid_inner");
	//点击每一个li切换ac
	for( var k=0; k<aLiNav.length; k++){
		aLiNav[k].index=k;
		aLiNav[k].onclick=function(){
			for( var K=0; K<aLiNav.length; K++){
				aLiNav[K].className="";
				aMidInner[K].className="mid_inner hide";
			};
			this.className="ac";
			aMidInner[this.index].className="mid_inner";
		};
	};
	
	
	/*$("#navList li").click(function(){
		$(this).addClass("ac").siblings("li").removeClass("ac");
		$("#midWarp .mid_inner:eq("+$(this).index()+")").removeClass("hide").siblings(".mid_inner").addClass("hide");
	})*/

//--------mid 切换图片 --------------

	var productList=document.getElementById('productList');
	var aProduct=productList.children;
	var li_w=hxsd_tools.getStyle(aProduct[0],"width")+hxsd_tools.getStyle(aProduct[0],"marginRight");
	var oBox=document.getElementById('box');
	productList.style.width=li_w*aProduct.length+'px';
	var pBtn=document.getElementById('arrowPrev');
	var nBtn=document.getElementById('arrowNext');
	var iNow=0;
	
	//点击pbtn
	pBtn.onclick=function(){
		iNow--;
		if(iNow<0){
			iNow=0;
		};
		hxsd_tools.move(productList,{"left":-iNow*li_w})
	};
	nBtn.onclick=function(){
		iNow++;
		if(iNow>=(productList.offsetWidth-oBox.offsetWidth)/li_w){
			iNow=(productList.offsetWidth-oBox.offsetWidth)/li_w;
		};
		hxsd_tools.move(productList,{"left":-iNow*li_w});

	};
};
$(function() {
    var url = "http://wthrcdn.etouch.cn/weather_mini?city=北京";

    function wea(d_url) {
        $.getJSON(d_url, function (data) {
            if (data.data.forecast[0].type == "晴") {
                $('.weather').find('i').html("<img src='images/day_qing.png'>")
            } else if (data.data.forecast[0].type == "多云") {
                $('.weather').find('i').html("<img src='images/day_duoyun.png'>")
            } else {
                $('.weather').find('i').html("<img src='images/day_yin.png'>")
            }

            $('.weather').find('p').eq(0).html("温度:" + data.data.wendu + "摄氏度/");
            $('.weather').find('p').eq(1).html(data.data.forecast[0].fengxiang);
        })
    }

    wea(url);
    $('.diqu').find('ul').each(function () {
        $(this).find('a').click(function () {
            var city = $(this).html();
            $(this).addClass('active').parent().siblings().find('a').removeClass('active');
            $('.diqu').find('a').eq(1).html(city);
            var url = "http://wthrcdn.etouch.cn/weather_mini?city=" + city;
            wea(url);
        })
    });

//choose部分的-----------------------------------------------------------
    /*$('#chooseShop').find('dl').find('dd').each(function () {
        $(this).click(function () {
            $(this).addClass('ac').siblings().removeClass('ac');

        })
    });*/
	$('#chooseShop').find("a").click(function(){
		$(this).addClass("ac").siblings("a").removeClass("ac");
	})

});